<template>
  <a-table
    rowKey="id"
    size="middle"
    bordered
    :loading="loading"
    :columns="columns"
    :dataSource="dataSource"
    :pagination="false"
  >
    <template slot="htmlSlot" slot-scope="text">
      <div v-html="text"></div>
    </template>

    <template slot="imgSlot" slot-scope="text">
      <div style="font-size: 12px;font-style: italic;">
        <span v-if="!text">无图片</span>
        <img v-else :src="getImgView(text)" alt="" style="max-width:80px;height:25px;"/>
      </div>
    </template>

    <template slot="fileSlot" slot-scope="text">
      <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
      <a-button
              v-else
              ghost
              type="primary"
              icon="download"
              size="small"
              @click="uploadFile(text)"
      >
        <span>下载</span>
      </a-button>
    </template>
  </a-table>
</template>

<script>
  import { getAction } from '@api/manage'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import {filterMultiDictText} from '@/components/dict/JDictSelectUtil'
  export default {
    name: 'OufuformInnerTableChildList',
    mixins: [JeecgListMixin],
    props: {
      record: {
        type: Object,
        default: null,
      },
      main:{
        type:Object,
        default:{},
        required:false
      },
      parentCode: {
        type: String,
        default: '',
      },
    },
    data() {
      return {
        description: this.main.description + '内嵌列表',
        disableMixinCreated: true,
        loading: false,
        dataSource: [],
        columns: [],
        url: {
          listByMainId: "/online/cgform/public/listSubById",
        },
      }
    },
    watch: {
      record: {
        immediate: true,
        deep:true,
        handler() {
          if (this.record != null) {
            this.loadData(this.record)
          }
        }
      }
    },
    created(){
      this.columns = [];
      let currColumns = this.main.columns
      currColumns.forEach(po=>{
        po.align = 'center';
        if(po.fieldShowType == 'date'){
          po.customRender = function (text) {
            return !text?"":(text.length>10?text.substr(0,10):text)
          }
        }else if(po.fieldShowType == 'Blob'){
          po.dataIndex = po.dataIndex + 'String';
        }else if(po.fieldShowType == 'umeditor'){
          po.scopedSlots =  {customRender: 'htmlSlot'}
        }else if(po.fieldShowType == 'file'){
          po.scopedSlots =  {customRender: 'fileSlot'}
        }else if(po.fieldShowType == 'image'){
          po.scopedSlots =  {customRender: 'imgSlot'}
        }else if(po.fieldShowType == 'list'||po.fieldShowType == 'radio'||po.fieldShowType == 'list_multi'||po.fieldShowType == 'checkbox'||po.fieldShowType == 'sel_search'||po.fieldShowType == 'cat_tree'||po.fieldShowType == 'sel_depart'){
          po.dataIndex =  po.dataIndex + '_dictText';
          po.customRender = function (text) {
            return text
          }
        }
        this.columns.push(po);
      })
    },
    methods: {
      loadData(record) {
        this.loading = true
        this.dataSource = []
        let params = {};
        params['autoHeadId'] = this.main.code;
        params['autoParentHeadId'] = this.parentCode;
        params['id'] = record.id;
        params['pageSize'] = 200;
        getAction(this.url.listByMainId, params).then((res) => {
          if (res.success) {
            this.dataSource = res.result
          }
        }).finally(() => {
          this.loading = false
        })
      },
    },
  }
</script>